/**
 * Created by yongzhi on 2015/3/23.
 */
define(['common/js/boss-frame-angular-dev-0.1','flottime','flot_pie','flot_tooltip'],function() {

    diretiveModule.directive("plusFlotLine", ["$compile", function ($compile) {
        return {
            scope: true,
            restrict: "AE",
            replace: true,
            transclude: true,
            controller: function ($scope) {
            },
            template: "<div style='height:250px;'></div>",
            compile: function (tElm, tAttrs) {
                if(!tAttrs.data){
                    console.error("请指定指令属性data");
                    return;
                }
                if(!tAttrs.customOptions && !tAttrs.totalOptions){
                    console.error("指令属性custom-options与total-options至少指定一个");
                    return;
                }

                var plotOptions = {
                    series: {
                        lines: {
                            show: true,
                            lineWidth: 1,
                            fill: true,
                            fillColor: {
                                colors: [
                                    {
                                        opacity: 0.3
                                    }, {
                                        opacity: 0.3
                                    }
                                ]
                            }
                        },
                        points: {
                            show: true
                        },
                        shadowSize: 1
                    },
                    grid: {
                        hoverable: true,
                        clickable: true,
                        tickColor: EmVars.colors.light.color,
                        borderWidth: 0
                    },
                    colors: [EmVars.colors.success.color, EmVars.colors.primary.color, EmVars.colors.info.color],
                    xaxis: {
                        mode: "time",
                        minTickSize: [1, "day"],
                        timeformat: "%Y/%m/%d"
                    },
                    yaxis: {
                        ticks: 10,
                        tickDecimals: 0
                    },
                    tooltip: true,
                    tooltipOpts: {
                        content: " %s:%y.2",
                        defaultTheme: false,
                        shifts: {
                            x: 0,
                            y: 20
                        }
                    }
                };
                var plotData,cusOpts,totalOpts;

                return {
                    pre: function (scope, elm, attrs) {
                        plotData = scope[attrs.data];
                        cusOpts = scope[attrs.customOptions];
                        totalOpts = scope[attrs.totalOptions];

                        if(totalOpts){
                            plotOptions = totalOpts;
                        }else{
                            for(var key in cusOpts){
                                plotOptions[key] = cusOpts[key];
                            }
                        }

                    },
                    post: function (scope, elm, attrs) {
                        var plotObj = $.plot(elm,plotData,plotOptions);

                        if(attrs.flotId){
                            scope.$on("refreshPlotLine-"+attrs.flotId,function(event,data){
                                plotObj.setData(data);
                                plotObj.setupGrid();
                                plotObj.draw();
                            });
                        }
                    }
                };
            }
        };
    }]);

    diretiveModule.directive("plusFlotPie", ["$compile", function ($compile) {
        return {
            scope: true,
            restrict: "AE",
            replace: true,
            transclude: true,
            controller: function ($scope) {
            },
            template: "<div style='height:250px;'></div>",
            compile: function (tElm, tAttrs) {
                if(!tAttrs.data){
                    console.error("请指定指令属性data");
                    return;
                }
                if(!tAttrs.customOptions && !tAttrs.totalOptions){
                    console.error("指令属性custom-options与total-options至少指定一个");
                    return;
                }

                var plotOptions = {
                    "series": {
                        "pie": {
                            "show": true,
                            "stroke": {"width": 0},
                            "label": {"show": true, "threshold": 0.05}
                        }
                    },
                    "colors": ["#19b5b7", "#16a1a3", "#138d8e", "#10797a", "#0e6566"],
                    "grid": {"hoverable": true, "clickable": false},
                    "tooltip": true,
                    "tooltipOpts": {"content": "%s: %p.0%", "defaultTheme": false, "shifts": {"x": 0, "y": 20}}
                };
                var plotData,cusOpts,totalOpts;

                return {
                    pre: function (scope, elm, attrs) {
                        plotData = scope[attrs.data];
                        cusOpts = scope[attrs.customOptions];
                        totalOpts = scope[attrs.totalOptions];

                        if(totalOpts){
                            plotOptions = totalOpts;
                        }else{
                            for(var key in cusOpts){
                                plotOptions[key] = cusOpts[key];
                            }
                        }

                    },
                    post: function (scope, elm, attrs) {

                        var plotObj = $.plot(elm,plotData,plotOptions);
                        var totalData = 0;
                        for(var index in plotData){
                            totalData += plotData[index].data;
                        }

                        if(totalData === 0){
                            var canvas = plotObj.getCanvas();
                            var ctx = canvas.getContext('2d');
                            var x = 100;
                            var y = 100;
                            ctx.font = '10pt Calibri';
                            ctx.textAlign = 'center';
                            ctx.fillText('无数据!', x, y);
                        }

                        if(attrs.flotId){
                            scope.$on("refreshPlotPie-"+attrs.flotId,function(event,data){

                                plotObj.setData(data);
                                plotObj.setupGrid();
                                plotObj.draw();

                                var totalData = 0;
                                for(var index in data){
                                    totalData += data[index].data;
                                }

                                if(totalData === 0){
                                    var canvas = plotObj.getCanvas();
                                    var ctx = canvas.getContext('2d');
                                    var x = 100;
                                    var y = 100;
                                    ctx.font = '10pt Calibri';
                                    ctx.textAlign = 'center';
                                    ctx.fillText('无数据!', x, y);
                                }

                            });
                        }
                    }
                };
            }
        };
    }]);

    diretiveModule.directive("plusFlotBar", ["$compile", function ($compile) {
        return {
            scope: true,
            restrict: "AE",
            replace: true,
            transclude: true,
            controller: function ($scope) {
            },
            template: "<div style='height:250px;'></div>",
            compile: function (tElm, tAttrs) {
                if(!tAttrs.data){
                    console.error("请指定指令属性data");
                    return;
                }
                if(!tAttrs.customOptions && !tAttrs.totalOptions){
                    console.error("指令属性custom-options与total-options至少指定一个");
                    return;
                }

                var plotOptions = {
                    xaxis: {
                        tickLength: 0
                    },
                    grid: {
                        hoverable: true,
                        clickable: false,
                        borderWidth: 0
                    },
                    legend: {
                        labelBoxBorderColor: "none",
                        position: "left"
                    },
                    colors:[EmVars.colors.primary.color, EmVars.colors.success.color, EmVars.colors.danger.color],
                    series: {
                        bars:{
                            show: true,
                            fill: true,
                            lineWidth: 1
                        },
                        shadowSize: 1
                    },
                    tooltip: true,
                    tooltipOpts: {
                        defaultTheme: false
                    }
                };
                var plotData,cusOpts,totalOpts;

                return {
                    pre: function (scope, elm, attrs) {
                        plotData = scope[attrs.data];
                        cusOpts = scope[attrs.customOptions];
                        totalOpts = scope[attrs.totalOptions];

                        if(totalOpts){
                            plotOptions = totalOpts;
                        }else{
                            for(var key in cusOpts){
                                plotOptions[key] = cusOpts[key];
                            }
                        }

                    },
                    post: function (scope, elm, attrs) {
                        var plotObj = $.plot(elm,plotData,plotOptions);

                        if(attrs.flotId){
                            scope.$on("refreshPlotBar-"+attrs.flotId,function(event,data){
                                plotObj.setData(data);
                                plotObj.setupGrid();
                                plotObj.draw();
                            });
                        }
                    }
                };
            }
        };
    }]);
});